<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Title</title>
    <script rel="stylesheet" src="/resources/js/jquery.min.js"></script>
    <link rel="stylesheet" href="/resources/layui/css/layui.css">
    <script rel="stylesheet" src="/resources/layui/layui.js"></script>
    <script src="/resources/js/function/Local.js"></script>
</head>
<body>
<form class="layui-form" id="form" action="">
    <div class="layui-form-item">
        <label class="layui-form-label">权限名称</label>
        <div class="layui-input-block">
            <input type="text" name="name" placeholder="请输入标题" autocomplete="off" class="layui-input">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">url</label>
        <div class="layui-input-block">
            <input type="text" name="url" placeholder="请输入标题" autocomplete="off" class="layui-input">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">pers_val</label>
        <div class="layui-input-block">
            <input type="text" name="persVar" placeholder="请输入标题" autocomplete="off" class="layui-input">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">parentId</label>
        <div class="layui-input-block">
            <select name="parentId" id="parentId"lay-filter="parentId" lay-verify="required">
                <option value="-1">请选择</option>
                <option value="1">一级</option>
                <option value="2">二级</option>
                <option value="3">三级</option>
            </select>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">disorder</label>
        <div class="layui-input-block">
            <select name="disorder" id="disorder" lay-verify="required">
                <option value="-1">请选择</option>
            </select>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">类型</label>
        <div class="layui-input-block">
            <input type="text" name="type" placeholder="（function,show）" autocomplete="off" class="layui-input">
        </div>
    </div>
    <div class="layui-form-item">
        <div class="layui-input-block">
            <button class="layui-btn" lay-submit lay-filter="formDemo">立即提交</button>
            <button type="reset" class="layui-btn layui-btn-primary">重置</button>
        </div>
    </div>
</form>
</body>
</html>
<script>
    //Demo
    layui.use('form', function(){
        var form = layui.form;
        //监听提交
        form.on('submit(formDemo)', function(data){
            layer.msg(JSON.stringify(data.field));
            $.post(new Local().base_url+"/perm/addshow",data.field,function(d){
               layer.msg("添加成功！");
            });
            return false;
        });
    });
    var table,form,layer,laytpl;
    layui.use(['table','form','laytpl','layer'], function(){
        table = layui.table;
        form=layui.form;
        layer=layui.layer;
        laytpl=layui.laytpl;
        form.on('select(parentId)', function(d){
            console.log(d.elem); //得到select原始DOM对象
            console.log(d.value); //得到被选中的值
            $.post(new Local().base_url+"/perm/getByJi",{id:d.value-1},function(data){
                $("#disorder").empty();
                $("<option value='-1'>请选择</option>").appendTo("#disorder");
                $.each(data.data, function () {
                    var opt = $("<option></option>").appendTo("#disorder");
                    opt.text(this.name).val(this.id);
                });
                layui.form.render();
            });
            form.render('select');
        });
    });

</script>